<template>
  <div class="tab" @click.stop="aotuTab=false">
    <el-tabs v-model="activeName">
      <!--明细表格-->
      <el-tab-pane :label="$t('market.detailInfo')" class="tabOne" name="first">
        <el-button :disabled="isDisabled" size="mini" style="margin-bottom: 5px;" @click="newHang">{{ $t('btn.newHang') }}<!--新增行--></el-button>
        <el-button size="mini" style="margin-bottom: 5px;" @click="delHang">{{ $t('btn.delHang') }}<!--删除行--></el-button>
        <el-button :disabled="isDisabled" size="mini" @click="batchFill">{{ $t('btn.batchFill') }}<!--批量填充--></el-button>
        <el-button size="mini" @click="quotatins">{{ $t('btn.quotatins') }}<!--获取单价--></el-button>
        <el-button size="mini" @click="billPrice">{{ $t('btn.billPrice') }}<!--填充基准价--></el-button>
        <el-button size="mini" @click="materDetail(1)">{{ $t('market.materDetail1') }}<!--整单材料明细--></el-button>
        <jc-table
          v-if="isRouterAlive"
          ref="dragTable"
          :table-data="tabTwo.saleDetails"
          :table-header="tableHeader"
          serial
          table-selection
          :table-height="tableHeight"
          get-row-key="fmaterialId"
          :get-summaries="getSummaries"
          show-summary
          @cellClick="cellClick"
          @selectionChange="selectionData"
        >
          <el-table-column :label="$t('market.frowType')" prop="frowType" align="center">
            <template slot-scope="scope">
              <el-select
                v-model="scope.row.frowType"
                placeholder="请选择"
                :disabled="scope.row.fdocumentstatus==='B'"
                size="mini"
                filterable
              >
                <el-option
                  v-for="iten in frowTypeData"
                  :key="iten.fid"
                  :label="iten.fname"
                  :value="iten.fid"
                />
              </el-select>
            </template>
          </el-table-column>
          <el-table-column v-if="bomCost('sal:custnat')" :label="$t('market.custmatNo')" prop="fcustmatNo" align="center">
            <template slot-scope="scope">
              <el-input
                v-model.trim="scope.row.fcustmatNo"
                size="mini"
                :disabled="scope.row.fdocumentstatus==='B'"
                @keyup.enter.native="copyDate(scope.row.fcustmatNo, scope.$index)"
              />
            </template>
          </el-table-column>
          <el-table-column v-if="bomCost('sal:custnat')" :label="$t('market.custmatname')" prop="fcustmatname" align="center" :show-overflow-tooltip="true" />
          <el-table-column :label="$t('market.fmaterial')" prop="fmaterialId" align="center" width="160px">
            <template slot-scope="scope">
              <el-input
                v-model.trim="scope.row.fnumber"
                size="mini"
                style="width: 100%"
                :disabled="scope.row.fdocumentstatus==='B'"
                @input="getAtuo(scope.$index, scope.row.fnumber)"
              >
                <i
                  slot="prefix"
                  class="iconfont icon-jin-rud-ao-bo"
                  @click="sonJumpMateriel(scope.row.fnumber)"
                />
                <i
                  slot="suffix"
                  class="el-input__icon el-icon-search"
                  @click="handleGetMateriel(scope.row, scope.$index)"
                />
              </el-input>
              <div v-if="aotuTab && material === scope.$index" :class="material<7 ? 'tabPosit': 'tabPosit1'">
                <number-code :fnumber="fnumber" @material="materialData" />
              </div>
            </template>
          </el-table-column>
          <el-table-column
            :label="$t('shop.fname2')"
            prop="fname"
            align="center"
            :show-overflow-tooltip="true"
            width="100px"
          />
          <el-table-column
            :label="$t('market.fdescripTion')"
            prop="fdescripTion"
            align="center"
            :show-overflow-tooltip="true"
            min-width="200px"
          />
          <el-table-column :label="$t('market.fmodel')" prop="fmodel" align="center" :show-overflow-tooltip="true" />
          <el-table-column :label="$t('market.funit')" prop="funitName" align="center" />
          <el-table-column :label="$t('market.fqty')" prop="fqty" align="center">
            <template slot-scope="scope">
              <el-input-number
                v-model="scope.row.fqty"
                :min="0"
                size="mini"
                :disabled="scope.row.fdocumentstatus==='B'"
                @change="handleChange(scope.$index)"
              />
            </template>
          </el-table-column>
          <el-table-column v-if="bomCost('sal:paice')" :label="$t('market.fprice')" prop="fprice" align="center" />
          <el-table-column v-if="bomCost('sal:paice')" :label="$t('market.ftaxPrice')" prop="ftaxprice" align="center">
            <template slot-scope="scope">
              <el-input-number
                v-if="editArrPrice.includes(typeid)"
                v-model="scope.row.ftaxprice"
                :min="0"
                size="mini"
                :disabled="scope.row.fdocumentstatus==='B'"
                @change="priceHandel(scope.$index)"
              />
              <span v-else>{{ scope.row.ftaxprice }}</span>
            </template>
          </el-table-column>
          <el-table-column v-if="bomCost('sal:reference')" :label="$t('market.freferencePrice')" prop="freferencePrice" align="center" />
          <!--  基准价 v-if="fsaleOrg1 === 155" -->
          <!--          <el-table-column prop="fbaseprice" align="center" width="100">-->
          <!--            <template slot="header">-->
          <!--              <span style="color: #f31818;font-weight: 600;">{{ $t('market.fbaseprice') }}($)</span>-->
          <!--            </template>-->
          <!--          </el-table-column>-->
          <!--  基准价  -->
          <!--          <el-table-column prop="fbasepricermb" align="center" width="100">-->
          <!--            <template slot="header">-->
          <!--              <span style="color: #f31818;font-weight: 600;">{{ $t('market.fbaseprice') }}(￥)</span>-->
          <!--            </template>-->
          <!--          </el-table-column>-->
          <el-table-column v-if="bomCost('sal:amount')" :label="$t('market.billamount')" prop="famount" align="center" />
          <el-table-column v-if="bomCost('sal:allamount')" :label="$t('market.billallamount')" prop="fallamount" align="center" />
          <el-table-column :label="$t('market.fdiscountRate')" prop="fdiscountRate" align="center">
            <template slot-scope="scope">
              <el-input-number
                v-model="scope.row.fdiscountRate"
                :min="0"
                size="mini"
                :disabled="scope.row.fdocumentstatus==='B'"
                @change="handleChange(scope.$index)"
              />
            </template>
          </el-table-column>
          <el-table-column :label="$t('market.fisFree')" prop="fisFree" align="center" width="50">
            <template slot-scope="scope">
              <el-checkbox
                v-model="scope.row.fisFree"
                :value="scope.row.fisFree"
                :disabled="scope.row.fdocumentstatus==='B'"
                @change="handleCheckedCitiesChange(scope.row.fisFree, scope.$index)"
              />
            </template>
          </el-table-column>
          <el-table-column :label="$t('market.ftaxRate')" prop="ftaxrate" align="center">
            <template slot-scope="scope">
              <el-input-number
                v-model="scope.row.ftaxrate"
                :min="0"
                size="mini"
                :disabled="scope.row.fisFree || scope.row.fdocumentstatus==='B'"
                @change="handleChange1(scope.$index)"
              />
            </template>
          </el-table-column>
          <el-table-column :label="$t('market.fpaezAssistant')" prop="F_PAEZ_ASSISTANT" align="center" width="140px">
            <template slot-scope="scope">
              <el-select
                v-model="scope.row.F_PAEZ_ASSISTANT"
                size="mini"
                filterable
                :disabled="scope.row.fdocumentstatus==='B'"
              >
                <el-option
                  v-for="iten in options"
                  :key="iten.fid"
                  :label="iten.fname"
                  :value="iten.fid"
                />
              </el-select>
            </template>
          </el-table-column>
          <!--          <el-table-column label="库存组织" prop="fstockorgid" width="120" align="center">-->
          <!--            <template slot-scope="scope">-->
          <!--              <el-select-->
          <!--                v-model.trim="scope.row.fstockorgid"-->
          <!--                filterable-->
          <!--                size="mini"-->
          <!--                :disabled="isDisabled"-->
          <!--                @change="scope.row.fownerid=scope.row.fstockorgid"-->
          <!--              >-->
          <!--                <el-option-->
          <!--                  v-for="option in teamList"-->
          <!--                  :key="option.fid"-->
          <!--                  :label="option.fname"-->
          <!--                  :value="option.fid"-->
          <!--                />-->
          <!--              </el-select>-->
          <!--            </template>-->
          <!--          </el-table-column>-->
          <!--          <el-table-column label="货主" prop="fownerid" width="120" align="center">-->
          <!--            <template slot-scope="scope">-->
          <!--              <el-select-->
          <!--                v-model.trim="scope.row.fownerid"-->
          <!--                disabled-->
          <!--                size="mini"-->
          <!--              >-->
          <!--                <el-option-->
          <!--                  v-for="option in teamList"-->
          <!--                  :key="option.fid"-->
          <!--                  :label="option.fname"-->
          <!--                  :value="option.fid"-->
          <!--                />-->
          <!--              </el-select>-->
          <!--            </template>-->
          <!--          </el-table-column>-->
          <el-table-column :label="$t('market.deliveryDate')" prop="fdeliveryDate" align="center" width="120">
            <template slot-scope="scope">
              <el-date-picker
                v-model="scope.row.fdeliveryDate"
                type="date"
                value-format="yyyy-MM-dd"
                size="mini"
                :disabled="scope.row.fdocumentstatus==='B'"
              />
            </template>
          </el-table-column>
          <el-table-column :label="$t('market.note')" prop="fnote" align="center">
            <template slot-scope="scope">
              <el-input
                v-model="scope.row.fnote"
                size="mini"
                :disabled="scope.row.fdocumentstatus==='B'"
              />
            </template>
          </el-table-column>
          <el-table-column label="CBM" prop="cbm" align="center">
            <template slot-scope="scope">
              <el-input-number
                v-model="scope.row.cbm"
                :min="0"
                size="mini"
                :disabled="scope.row.fdocumentstatus==='B'"
              />
            </template>
          </el-table-column>
          <el-table-column :label="$t('market.hangStates')" prop="cbm" align="center">
            <template slot-scope="scope">
              <el-tag v-if="scope.row.fdocumentstatus === 'B'">{{ $t('market.state2') }}</el-tag>
              <el-tag v-else type="danger">{{ $t('market.state6') }}</el-tag>
            </template>
          </el-table-column>
          <el-table-column :label="$t('market.handle')" width="130px" align="center" fixed="right">
            <template slot-scope="scope">
              <el-button
                type="primary"
                size="mini"
                @click="materDetail(scope.row.fentryId)"
              >{{ $t('market.materDetail') }}</el-button>
            </template>
          </el-table-column>
        </jc-table>
      </el-tab-pane>
      <!--      操作日志-->
      <el-tab-pane name="third">
        <jc-table
          serial
          :table-header="logTableHeader"
          :table-data="otherLogTableData.array"
          :table-height="tableHeight1"
        />
        <jc-pagination
          :total="otherLogTableData.total"
          :page.sync="logTable.pageNum"
          :limit.sync="logTable.pageSize"
          @pagination="handleOther"
        />
      </el-tab-pane>
    </el-tabs>
    <!--    物料弹窗-->
    <material v-if="isMateria" :msg="material" :msg1="fid" :index="index1" :fissale="fissale" @material="materialData" />
    <!-- 材料明细 -->
    <materDetail v-if="isMaterDetail" :list-data="listData" @delive="isMaterDetail=false" />
  </div>
</template>

<script>
import jumpMateriel from '@/components/JumpMateriel'
import {
  paddingSalDownPrice, queryCustmatmappingList,
  queryMaterialsPrice,
  querySalDownPrice,
  queryViewItem, deletes
} from '@/api/marketManage/marketOrder'
import { orderPurchase } from '@/utils/hasPermission'
import autocomplete from '@/views/market/marketManage/createMarkerOrder/components/autocomplete'

export default {
  components: {
    material: () => import('@/views/market/marketManage/createMarkerOrder/components/material'),
    materDetail: () => import('@/views/market/marketManage/createMarkerOrder/components/materDetail'),
    numberCode: () => import('@/components/NumberCode')
  },
  mixins: [jumpMateriel, autocomplete],
  props: {
    msg: { // 明细信息
      type: Array,
      required: true
    },
    msg2: { // 表单数据
      type: Object,
      required: true
    },
    standardPrice: {
      type: Object,
      default: function() {
        return {}
      }
    },
    otherLogTableData: {
      type: Object,
      default: function() {
        return {}
      }
    },
    active: {
      type: String,
      default: ''
    },
    isDisabled: {
      type: Boolean,
      default: false
    },
    teamList: {
      type: Array,
      default: function() {
        return []
      }
    },
    forgid: {
      type: [String, Number],
      default: '' || 0
    },
    typeid: {
      type: [String, Number],
      default: '' || 0
    }
  },
  data() {
    return {
      listData: [],
      isMaterDetail: false,
      editArrPrice: ['售后销售订单', '材料销售订单', '样品销售订单'],
      cutMoney: '',
      fdownName: '销售基准价',
      fid: '', // 价目ID
      fissale: '1', // 允许销售
      isMateria: false, // 物料弹窗组件
      isUploadImg: false, // 上传图片组件
      salImg: {},
      indexSelf: 0, // 图片下标
      imgVisible: false, // 预览图片
      priview: '',
      isdrawinglDialog: false, // 图纸弹窗
      activeName: 'first',
      tableHeader: [],
      tableHeight: '60vh',
      tableHeight1: '58vh',
      isMaterielDialog: false,
      rotate: '',
      // 点击行的序号
      material: 0,
      index1: 0, // 父传子
      options: [], // 包装方式
      frowTypeData: [], // 产品类型
      isRouterAlive: true,
      basicUnit: [], // 单位
      tabTwo: {
        // 明细信息
        saleDetails: [{
          frowType: 'Standard',
          fmapId: '',
          cbm: '',
          F_PAEZ_ASSISTANT: 24,
          fnote: '',
          fmaterialId: '',
          fdescripTion: '',
          funitId: '',
          fqty: 0,
          fisFree: false,
          ftaxrate: 0,
          fdeliveryDate: new Date(),
          fdownPrice: '',
          fisdefault: 0,
          famount: 0,
          fdiscountRate: 0,
          fprice: 0,
          fallamount: 0,
          salImage: {
            imageUrl: '', // 图片
            imageUrl1: '', // 图片
            imageUrl2: '', // 图片
            imageUrl3: '', // 图片
            imageUrl4: '', // 图片
            imageUrl5: ''
          }
        }],
        // 收款计划
        planDetails: []
      },
      tab: orderPurchase('salorder:purchase'),
      verify: [],
      shuliang: 0.5,
      // 日志头部
      logTableHeader: [
        { label: this.$t('market.fdate'), prop: 'createDate' },
        { label: this.$t('market.operator'), prop: 'fname' },
        { label: this.$t('market.deaprt'), prop: 'fdeaprt' },
        { label: this.$t('market.ipSite'), prop: 'fip' },
        { label: this.$t('market.describe'), prop: 'fdescribe' }
      ],
      logTable: {
        pageNum: 1,
        pageSize: 10
      },
      fsaleOrg1: '',
      aotuTab: false,
      fnumber: ''
    }
  },
  watch: {
    msg() {
      this.tabTwo.saleDetails = this.msg
    },
    msg2() {
      this.fsaleOrg = this.msg2.fsaleOrgId
      this.fsaleOrg1 = this.msg2.fbillTypeId
    },
    active() {
      this.activeName = this.active
    },
    forgid: {
      handler(val) {
        this.tabTwo.saleDetails.map(res => {
          res.fownerid = val
          res.fstockorgid = val
        })
      },
      deep: true
    }
  },
  created() {
    this.queryBasAssList()
    this.queryMetaType()
    // this.getBasicUnit() // 单位
    this.tableHeight = window.innerWidth > 1440 ? 'calc(100vh - 380px)' : '68vh'
    this.tableHeight1 = window.innerWidth > 1440 ? 'calc(100vh - 400px)' : '58vh'
  },
  methods: {
    // 操作日志翻页
    handleOther() {
      this.$emit('page', this.logTable)
    },
    // 输入物料编码
    getAtuo(index, fnumber) {
      this.material = index
      this.aotuTab = true
      var vm = this
      clearTimeout(vm.timer) // 清除未执行的代码，重置回初始化状态
      vm.timer = setTimeout(() => {
        this.fnumber = fnumber
      }, 600)
    },
    // 局部刷新
    reload() {
      this.isRouterAlive = false
      this.$nextTick(function() {
        this.isRouterAlive = true
      })
    },
    // 销售订单产品类型
    queryMetaType() {
      queryViewItem({ viewName: 'SX_V_SAL_PRODUCTIONTYPE' }).then(res => {
        this.frowTypeData = res.data.list
      })
    },
    // 物料弹窗选中
    materialData(item) {
      if (item.index) {
        this.material = item.index
      }
      if (item.fmaterialId) {
        const items = this.tabTwo.saleDetails[this.material]
        items.fmaterialId = item.fmaterialId
        items.ferpclsId = item.ferpclsId
        items.fnumber = item.fnumber
        items.fname = item.fname
        items.fdescripTion = item.fdescripTion
        items.funitId = item.fsaleUnitId
        items.funitName = item.fsaleUnit
        items.fmodel = item.fmodel
        items.fid = item.fid
        items.fisdefault = item.fisdefault
        items.fpriceunitid = item.fpurchasepriceUnitId
        this.isMateria = false
        this.querySalDownPrice()
      } else {
        this.isMateria = false
      }
    },
    // 打开物料编码
    async handleGetMateriel(row, index) {
      this.isMateria = true
      this.material = index
      this.index1 = index
    },
    // 监听是否勾选赠品
    handleCheckedCitiesChange(val, index) {
      if (val) {
        this.tabTwo.saleDetails[index].fprice = 0
        this.tabTwo.saleDetails[index].ftaxprice = 0
        this.tabTwo.saleDetails[index].ftaxrate = 0
      } else {
        this.material = index
        this.querySalDownPrice(1)
      }
      this.handleChange1(index)
      this.$emit('visible', this.tabTwo)
    },
    // 监听销售数量
    handleChange(index) {
      const item = this.tabTwo.saleDetails[index]
      this.material = index
      item.fallamount = (item.fqty * item.ftaxprice * (1 - item.fdiscountRate / 100)).toFixed(2)
      item.ftaxAmount = (item.fqty * item.ftaxprice * (1 - item.fdiscountRate / 100)).toFixed(2)
      item.famount = (item.fqty * item.fprice * (1 - item.fdiscountRate / 100)).toFixed(2) // 含税金额(接口需要字段)
      this.$emit('visible', this.tabTwo)
    },
    // 监听单价
    priceHandel(index) {
      const item = this.tabTwo.saleDetails[index]
      item.fprice = (item.ftaxprice / (1 * 1 + item.ftaxrate / 100)).toFixed(4)
      this.handleChange(index)
    },
    // 监听税率,修改税率更改销售基准价(含税),不更改单价,含税单价,销售基准价
    handleChange1(index) {
      const item = this.tabTwo.saleDetails[index]
      item.fprice = (item.ftaxprice / (1 + item.ftaxrate / 100)).toFixed(4)
      this.handleChange(index)
      this.$emit('visible', this.tabTwo)
    },
    // 监听应收比例
    handleChange2() {
      this.$emit('visible', this.tabTwo)
    }, // 监听应收金额
    handleChange3() {
      this.$emit('visible', this.tabTwo)
    }, // 监听是否预收
    check() {
      this.$emit('visible', this.tabTwo)
    },
    // 全选
    selectionData(val) {
      this.delfnumber = val[0].fnumber
      this.fentryData = []
      val.forEach(res => {
        this.fentryData.push(res.fentryId)
      })
      this.$emit('entry', this.fentryData)
    },
    // 获取对应的销售基准价
    async querySalDownPrice(ev) {
      const items = this.tabTwo.saleDetails[this.material]
      const DATA = {
        fmaterialId: items.fmaterialId,
        fid: this.standardPrice.fpriceListId,
        exchangeRate: this.standardPrice.fexchangeRate,
        tocurrId: this.standardPrice.fsettleCurrId
      }
      const { data: RES, code, message } = await querySalDownPrice(DATA)
      if (code !== 0) {
        this.$confirm(message, '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'error'
        })
      }
      items.fprice = RES.fprice
      items.ftaxprice = RES.fprice
      items.freferencePrice = RES.freferencePrice // 参考价
      items.fbaseprice = RES.fbaseprice
      items.fbasepricermb = RES.fbasepricermb
      items.fbaseprice1 = RES.fbaseprice
      items.fbasepricermb1 = RES.fbasepricermb
      ev === 1 && this.handleChange1(this.material)
    },
    // 客户物料编码
    copyDate(ev, index) {
      const items = this.tabTwo.saleDetails[index]
      const DATA = {
        fcustList: ev,
        fmaterialId: items.fmaterialId,
        fcustId: this.standardPrice.fcustId,
        fid: this.standardPrice.fpriceListId,
        exchangeRate: this.standardPrice.fexchangeRate,
        tocurrId: this.standardPrice.fsettleCurrId
      }
      queryCustmatmappingList(DATA).then(res => {
        if (res.code === 0) {
          const item = res.data
          // this.newHang()
          this.tabTwo.saleDetails[index] = {
            fpriceunitid: item.fpurchasepriceUnitId,
            fbaseprice: item.fbaseprice, // 基准价
            fbasepricermb: item.fbasepricermb,
            fbaseprice1: item.fbaseprice,
            fbasepricermb1: item.fbasepricermb,
            fcustmatNo: item.fcustmatno,
            frowType: 'Standard',
            fdiscountRate: 0,
            fmapId: item.fmapId,
            fsuite: item.fsuite,
            F_PAEZ_ASSISTANT: 24,
            fnote: '',
            fmaterialId: item.fmaterialId,
            fnumber: item.fnumber,
            fdescripTion: item.fdescription,
            fmodel: item.fmodel,
            fcustmatname: item.fcustmatname,
            funitId: item.funitId,
            funitName: item.funitName,
            fqty: 0,
            fprice: item.fprice,
            fisFree: false,
            ftaxRate: 0,
            ftaxPrice: item.fprice,
            famount: 0,
            fdeliveryDate: new Date().toJSON().split('T')[0],
            ftaxAmount: 0,
            cbm: 0,
            fownerId: 1,
            fstockorgId: 1,
            fownerid: 1,
            fsettleorgId: this.fsaleOrg
          }
          this.reload()
        } else {
          this.$confirm(res.message, '提示', {
            confirmButtonText: '确定',
            cancelButtonText: '取消',
            type: 'error'
          })
        }
      })
    },
    // 填充基准价
    billPrice() {
      this.fmaterId = []
      this.tabTwo.saleDetails.forEach(res => {
        this.fmaterId.push(res.fmaterialId)
      })
      const DATA = {
        exchangeRate: this.standardPrice.fexchangeRate,
        tocurrId: this.standardPrice.fsettleCurrId,
        fmaterId: this.fmaterId
      }
      paddingSalDownPrice(DATA).then(res => {
        if (res.code === 0) {
          this.tabTwo.saleDetails.map(ite => {
            res.data.forEach(item => {
              if (ite.fmaterialId === item.fmaterialId) {
                ite.fbaseprice = item.fbaseprice // 基准价
                ite.fbasepricermb = item.fbasepricermb
                ite.fbaseprice1 = item.fbaseprice
                ite.fbasepricermb1 = item.fbasepricermb
              }
            })
          })
        } else {
          this.$confirm(res.message, '提示', {
            confirmButtonText: '确定',
            cancelButtonText: '取消',
            type: 'error'
          })
        }
      })
    },
    // 获取全部单价
    quotatins() {
      if (!this.standardPrice.fpriceListId) {
        this.$message.warning('请选择价目表！')
        return
      }
      this.fmater = []
      this.tabTwo.saleDetails.forEach(res => {
        this.fmater.push(res.fmaterialId)
      })
      const DATA = {
        materialIdList: this.fmater,
        fid: this.standardPrice.fpriceListId,
        fsettleCurrId: this.standardPrice.fsettleCurrId
      }
      queryMaterialsPrice(DATA).then(res => {
        if (res.code === 0) {
          this.tabTwo.saleDetails.map(item => {
            res.data.priceList.forEach(ite => {
              if (item.fmaterialId === ite.fmaterialId) {
                item.fprice = ite.fprice
                item.ftaxprice = ite.fprice
              }
            })
          })
        } else {
          this.$confirm(res.message, '提示', {
            confirmButtonText: '确定',
            cancelButtonText: '取消',
            type: 'error'
          })
        }
      })
    },
    // 获取包装台式
    async queryBasAssList() {
      await queryViewItem({ viewName: 'SX_V_PACKING' }).then(res => {
        if (res.code === 0) {
          this.options = res.data.list
        } else {
          this.$confirm(res.message, '提示', {
            confirmButtonText: '确定',
            cancelButtonText: '取消',
            type: 'error'
          })
        }
      })
    },
    // 基本单位
    async getBasicUnit() {
      const { data: RES } = await queryViewItem({ viewName: 'SX_V_BASEUNIT', isAll: 1 })
      this.basicUnit = RES.list
    },
    // 选择单位
    selectUnit(index) {
      const item = this.tabTwo.saleDetails[index]
      this.basicUnit.filter(res => {
        if (res.fvalue === item.funitId) {
          item.funitName = res.fname
        }
      })
    },
    // 材料明细
    materDetail(ev) {
      this.listData = []
      ev === 1 ? this.tabTwo.saleDetails.forEach(res => {
        this.listData.push(res.fentryId)
      }) : this.listData = [ev]
      this.isMaterDetail = true
    },
    // 新增行
    newHang() {
      this.tabTwo.saleDetails.push(
        {
          freferencePrice: 0,
          fbaseprice: 0,
          fbasepricermb: 0,
          frowType: 21,
          fid: '',
          ferpclsId: '',
          fmapId: '',
          cbm: '',
          F_PAEZ_ASSISTANT: 24,
          fnote: '',
          fmaterialId: '',
          fdescripTion: '',
          funitId: '',
          fqty: 0,
          fisFree: false,
          ftaxrate: 0,
          fprice: 0,
          fdeliveryDate: new Date(),
          fisdefault: 0,
          fdownPrice: 0,
          fdiscountRate: 0,
          famount: 0,
          fallamount: 0,
          fownerId: 1,
          fstockorgId: 1,
          fownerid: 1,
          fsettleorgId: this.fsaleOrg,
          salImage: {
            imageUrl: '', // 图片
            imageUrl1: '', // 图片
            imageUrl2: '', // 图片
            imageUrl3: '', // 图片
            imageUrl4: '', // 图片
            imageUrl5: '' // 图片
          }
        }
      )
    },
    // 删除行
    delHang() {
      this.tabTwo.saleDetails.forEach((res, index) => {
        if (res.fnumber === this.delfnumber) {
          if (res.fentryId) {
            const DATA = {
              EntryIds: this.fentryData,
              fIds: [this.msg2.fid]
            }
            deletes(DATA).then(res => {
              if (res.code === 0) {
                this.tabTwo.saleDetails.splice(index, 1)
                this.$refs.dragTable.clearSelect()
              } else {
                this.$confirm(res.message, '提示', {
                  confirmButtonText: '确定',
                  cancelButtonText: '取消',
                  type: 'error'
                })
              }
            })
          } else {
            this.tabTwo.saleDetails.splice(index, 1)
            this.$refs.dragTable.clearSelect()
          }
        }
      })
      // this.$emit('visible', this.tabTwo)
    },
    // 点击单元格
    cellClick(row, column, cell, event) {
      this.property = column.property
      this.subscript = row.index
    },
    // 批量填充
    batchFill() {
      const item = this.tabTwo.saleDetails[this.subscript][this.property]
      this.tabTwo.saleDetails.map((res, index) => {
        if (index >= this.subscript) {
          res[this.property] = item
        }
      })
    }
  }
}
</script>
<style lang="scss">
.el-dialog__body {
  overflow: auto;
  img{
    max-width: 1000px;
    position: relative;
    left: 50%;
    transform: translateX(-50%);
  }
}
</style>
<style scoped lang="scss">
.el-tabs {
  &::v-deep .el-tabs__item {
    height: 30px;
    line-height: 30px;
  }
  .el-tabs ::v-deep .el-tabs__header{
    margin: 0 0 5px;
  }
}
.tabPosit {
  padding: 5px;
  box-shadow: 0 0 2px #aaa;
  position: absolute;
  top: 3.8vh;
  left: 0;
  background-color: rgba(255, 255, 255, 1);
  z-index: 99999!important;
}
.tabPosit1 {
  padding: 5px;
  box-shadow: 0 0 2px #aaa;
  position: absolute;
  top: -25.69vh;
  left:0;
  background-color: rgba(255, 255, 255, 1);
  z-index: 9999;
}
/* 图纸单元格居中 */
.el-table ::v-deep td{
  padding: 8px 0;
  &:nth-last-child(2) .cell {
    display: flex;
    justify-content: center;
    align-items: center;
    img {
      padding: 0 5px;
    }
  }
}
.tab {
  @include listBom;
  padding: 0;
  .materiel-form {
    display: flex;
    align-items: center;
    flex-direction: row;
    margin-bottom: 20px;

    .materiel-code {
      margin-right: 5px;
      font-weight: bold;
      font-size: 14px;
      min-width: 65px;
      color: #606266;
      line-height: 40px;
    }

    .input-width {
      width: 200px;
      margin-right: 10px;
    }
  }
  .el-form {
    display: flex;
    flex-wrap: wrap;
  }
  .avatar-uploader .el-upload {
    height: 78px;
    border: 1px dashed #d9d9d9;
    border-radius: 6px;
    cursor: pointer;
    position: relative;
    overflow: hidden;
  }

  .avatar-uploader .el-upload:hover {
    border-color: #409EFF;
  }

  .avatar-uploader-icon {
    font-size: 28px;
    color: #8c939d;
    width: 78px;
    height: 78px;
    line-height: 78px;
    text-align: center;
    border: 1px dashed #aaa;
    border-radius: 6px;
  }

  .avatar {
    width: 78px;
    height: 78px;
    display: block;
    border-radius: 6px;
  }

  .avatar-uploader {
    transition: all 1s;
  }

  .avatar-uploader:hover .magnify {
    display: block;
  }

  .magnify {
    display: none;
    height: 78px;
    background-color: rgba(0, 0, 0, .4);
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    line-height: 78px;
    border-radius: 6px;

    i {
      font-size: 18px;
      color: #fff;
      padding: 0 5px;
    }
  }
}
</style>
